<template>
    <div class="stock-contianer">
        <van-list v-model="stock.loading" :finished="stock.finished" finished-text="没有更多了" @load="controllerRequestList">
            <ul class="stock-listing">
                <li v-for="(item, index) in stock.items" :key="index" @click="eventClickOpenDetails(index)">
                    <p>{{ item.number }}</p>
                    <!-- <p>总重量：<span>{{ item.cweight }}kg</span></p> -->
                    <p>总重量：<span>{{ item.weighting }}kg</span></p>
                </li>
            </ul>
        </van-list>
        <tab-group v-if="$store.state.options.user.oda.groupid != 7" :dataset="navButtonGroup" identity="5" index="1"></tab-group>
    </div>
</template>

<script>
    import {List} from 'vant';
    import TabGroup from "../../components/currency/tab/tab.vue";

    export default {
        name: "ReservoirMStockM",
        components: {
            [List.name]: List,
            TabGroup
        },
        data() {
            return {
                navButtonGroup: [
                    {
                        name: "订单", route: {path: '/reservoirManagement/index'}
                    },
                    {
                        name: "库存管理", route: {path: '/reservoirManagement/stockM'}
                    },
                    {
                        name: "查询报价", route: {path: '/reservoirManagement/enquiry-quotation'}
                    },
                    {
                        name: "个人中心", route: {path: '/reservoirManagement/personal-center'}
                    }
                ],
                stock: {
                    page: 0, limit: 30,
                    loading: false, finished: false,
                    items: []
                }
            }
        },
        mounted() {
            // console.log(this.$route.query)
            if(this.$route.query.mode != 'out') window.sessionStorage.removeItem('outOrder');
        },
        methods: {
            controllerRequestList() {
                var url = '/api/home/tray/getlist',
                    params = {
                        page: this.stock.page,
                        list_rows: this.stock.limit
                    },
                    order = window.sessionStorage.getItem('outOrder');

                if(order) params.orderid = order;

                this.$util.postRequestInterface(url, params, (res) => {
                    if(res.data.data) {
                        this.stock.items = res.data.data;
                        this.stock.page++;
                    }

                    if(this.stock.items.length >= res.data.count) this.stock.finished = true;
                    this.stock.loading = false;
                })
            },
            eventClickOpenDetails(index) {
                var { token, id, number } = this.stock.items[index];

                this.$router.push({
                    path: '/reservoirManagement/stock-tray',
                    query: {
                        token, child: id, name: number
                    }
                });
            }
        }
    }
</script>

<style scoped lang="scss">
    .stock-listing {

        li {
            padding: 1.6rem;
            display: flex;
            font-size: 1.4rem;
            border-bottom: 0.4rem solid #F4F4F4;

            p {
                color: #999999;
            }

            p:first-child {
                flex: 1;
                color: #333333;
            }

            p:last-child {
                margin-left: 1rem;
            }

            p span {
                color: #00CC00;
            }
        }
    }
</style>
